<template>
  <div class="power">
    <!-- 角色权限 -->
    <div class="power_item" v-show="isShowRole">
      <div>
        <el-radio-group v-model="role" @input="roleChange">
          <el-radio v-for="(item, index) in roles" :key="index" :label="item.value">{{
            item.label
          }}</el-radio>
        </el-radio-group>
      </div>
    </div>
    <!-- 功能权限 -->
    <div class="power_item">
      <h4>{{ $t('members.chengyuan69') }}</h4>
      <div>
        <el-checkbox-group v-model="checkPermissions">
          <!-- :label="item." -->
          <el-checkbox
            v-for="(item, index) in permissionList"
            :key="index"
            :label="item.id"
            v-show="item.disable !== '禁用'"
          >
            {{ item.name }}</el-checkbox
          >
        </el-checkbox-group>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  // <!-- 机构成员 -->
  name: 'power',

  data() {
    return {
      roles: [],
      role: 0,
      organizedType: null,
      checkPermissions: [],
      user_owner: null,
      res_permissionList: [],
      permissionList: [],

      // 是否显示角色权限(只有诊所 技工所 下面的表格行为普通成员才不显示)
      isShowRole: true,
    };
  },
  props: {
    permissionList: Array,
  },

  created() {
    // 判断是技工所还是诊所，然后动态的设置角色权限的数据
    this.setRoleList();

    this.user_owner = localStorage.getItem('user_owner'); // 1为所有者
    this.user_roleId = localStorage.getItem('user_roleId');
  },
  methods: {
    setRoleList() {
      this.organizedType = localStorage.getItem('user_organizedType'); // 1诊所 2技工所
      if (this.organizedType == 1) {
        // 诊所
        this.roles = [
          {
            label: this.$t('members.chengyuan58'),
            value: 2,
          },
          {
            label: this.$t('members.chengyuan57'),
            value: 3,
          },
        ];
      } else if (this.organizedType == 2) {
        // 诊所
        this.roles = [
          {
            label: this.$t('members.chengyuan58'),
            value: 4,
          },
          {
            label: this.$t('members.chengyuan57'),
            value: 5,
          },
        ];
      }
    },
    roleChange(value) {
      this.$emit('getPowerData', value);
    },
    getpermissionList() {},
  },
};
</script>

<style lang="scss">
.power {
  .power_item:nth-child(1) {
    border-bottom: 1px solid #f7f2f2;
  }
  .power_item {
    padding: 5px;
    h4 {
      font-size: 15px;
      margin-bottom: 10px;
    }
    .el-checkbox {
      height: 25px;
      line-height: 25px;
    }
  }
}
</style>
